window.onload=function(){
    //分页显示数据
    loadUsersData();
    //获取末页码
    getMaxPage();

}

//页码数
var pageNo = 1;
//每页显示记录数
var pageSize = 5;

/**
 * 分页读取用户数据
 *   页码pageNo  每页显示5条pageSize
 */
function loadUsersData(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });
}

/** 
 * 获取末页码
 */
function getMaxPage(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    axios.get("http://localhost:3000/user/getMaxPage",
        {
            params:{"pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let maxPage = res.data.maxPage;
        //显示页码
        document.getElementById("totalPage").innerText = maxPage;
    }).catch(function(err){
        console.log(err)
    });
}

/**
 * 分页读取首页用户数据
 */
function toFirstPage(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });
}

/**
 * 分页读取下一页用户数据
 */
 function toNextPage(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    //获取下一页
    var pageNo = parseInt(document.getElementById("currentPage").innerText) + 1;
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });
 }

/**
 * 分页读取上一页用户数据
 */
function toPrevPage(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    //获取下一页
    var pageNo = parseInt(document.getElementById("currentPage").innerText) - 1;
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });
}

/**
 * 分页读取末页用户数据
 */
function toLastPage(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    //获取末页
    var pageNo = document.getElementById("totalPage").innerText;
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize,"yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });
}

/**
 * 根据条件分页查询用户信息
 */
function searchUsers(){
    //获取条件
    var yhm = document.getElementById("yhm").value;
    yhm = yhm ? yhm:"";
    //点击查询按钮，从第一页显示
    var pageNo = 1;
    axios.get("http://localhost:3000/user/selectUsers",
        {
            params:{"pageNo":pageNo, "pageSize":pageSize, "yhm":yhm}
        }
    )
    .then(function(res){
        let usersData = res.data.usersData;
        let fu = document.getElementsByTagName("tbody")[0];
        fu.innerHTML="";
        for(let item of usersData){
            let tr = document.createElement("tr");
            tr.innerHTML=`<td>${item.userCode}</td>
                            <td>${item.userName}</td>
                            <td>${item.sex}</td>
                            <td>${item.age}</td>
                            <td>${item.phone}</td>
                            <td>${item.roleName}</td>
                            <td>
                                <a href="userView.html"><img src="./public/images/read.png" alt="查看" title="查看"/></a>
                                <a href="userUpdate.html"><img src="./public/images/xiugai.png" alt="修改" title="修改"/></a>
                                <a href="#" class="removeUser"><img src="./public/images/schu.png" alt="删除" title="删除"/></a>
                            </td>`;
            fu.appendChild(tr);
        }
        //显示页码
        document.getElementById("currentPage").innerText = pageNo;
        //动态添加删除事件
        bindRemoveUserFn();

    }).catch(function(err){
        console.log(err)
    });

    //最新末页
    getMaxPage();

}

/**
 * 绑定删除用户信息事件
 */
function bindRemoveUserFn(){
    var arr = document.getElementsByClassName("removeUser");
    for(let i=0; i<arr.length; i++){
        arr[i].onclick=function(){
            if(confirm("确认删除吗？")){
                var userCode = this.parentNode.parentNode.children[0].innerText;
                axios.delete("http://localhost:3000/user/deleteUser",
                    {
                        params:{"userCode":userCode}
                    }
                )
                .then(function(res){
                    let result = res.data.result;
                    console.log(result);
                    //重新加载页面
                    loadUsersData();
                }).catch(function(err){
                    console.log(err)
                });
            }
            
        }
    }
}